<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>easyCMS</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/resource/layuimini/lib/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/resource/layuimini/css/public.css" media="all">
    <style>
        body{
            background: #fff;
        }
        form{
            width: 600px;
            margin: 0 auto;
        }
        .layui-form-label{
            width: 140px;
        }
        .layui-form-item .layui-input-inline {
            width: 250px;
        }
    </style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">

        <form class="layui-form" lay-filter="form" id="form">
            <input type="hidden" id='id' name='id' value="">
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="x-red">*</span>角色</label>
                <div class="layui-input-inline">
                    <div id="selectTree"></div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="x-red">*</span>账号</label>
                <div class="layui-input-inline">
                    <input type="text" id="username" name="username" lay-verify="required" placeholder="请输入用户账号" maxlength="20" autocomplete="off" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="x-red">*</span>昵称</label>
                <div class="layui-input-inline">
                    <input type="text" id="nickname" name="nickname" lay-verify="required" placeholder="请输入用户昵称" maxlength="20" autocomplete="off" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <input type="text" id="password" name="password" placeholder="请输入密码，留空不修改" maxlength="20" autocomplete="off" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"></label>
                <div class="layui-input-inline">
                    <button type="button" class="layui-btn" lay-submit="" lay-filter="smBtn">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>


    </div>
</div>

<script src="/resource/layuimini/lib/layui/layui.js" charset="utf-8"></script>
<script src="/resource/js/xm-select.js" charset="utf-8"></script>
<script>
    layui.use(['form'], function () {
        let form = layui.form
        let $ = layui.jquery
        form.val("form", {
            "id": "{$user->id|default=''}",
            "username": "{$user->username|default=''}",
            "nickname": "{$user->nickname|default=''}",
        });
        xmSelect.render({
            el: '#selectTree',
            name:'roles',
            theme: {
                color: '#0081ff',
            },
            autoRow: true,
            tree: {show: true, expandedKeys: true, strict: false},
            toolbar: {show: true, list: ["ALL","CLEAR","REVERSE"]},
            initValue: [{$hasRoles}],
            data: <?= json_encode($roles); ?>
        })
        //监听提交
        form.on('submit(smBtn)', function(data){
            let id = $("#id").val()
            let url = ''
            if (id == '')
            {
                url = "/admin/user/doUserAdd"
            }else{
                url ="/admin/user/doUserEdit"
            }

            $.post(url, $("#form").serialize(), function(resp){
                parent.layer.alert(resp.msg,function(index){
                    if(resp.code == 0)
                    {
                        let iframe = parent.document.querySelector('.layui-show').querySelector('iframe')
                        iframe.contentWindow.layui.table.reload('listTable')
                        parent.layer.closeAll()
                    }else {
                        parent.layer.close(index)
                    }
                });
            }, "json");
        });
    });
</script>

</body>
</html>